<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的钱包</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/aui2/aui.css" />
	<style>
	    body {}
	    .aui-list-header{
	    	background-color:#FFF !important;
	    }
	    .panel{
    	    display:block;
    	    color:#0b0b0b;
    	    font-family: "黑体";
    	    font-size: 24px;
    	    background-color: #269d83;
    	}
    	.center{
    	    width:100%;
    	    text-align: center;
    	    height:48px;
    	    line-height:48px;
    	    color:#fff;
    	    font-size: 16px;
    	}
    	#wallet{
    	    font-size: 40px;
    	}
    	.buttons{
    	    margin-top:12px;
    	    height:50px;
    	    display: -webkit-flex;
    	    display: -webkit-box;
    	}
    	.buttons>div{
    	    -webkit-flex:1;
    	    -webkit-box-flex:1;
    	    padding: 0 0.75rem;
    	    margin:0.25rem 0;
    	    display:-webkit-flex;
    	    display: -webkit-box;
    		-webkit-justify-content:center;
    		-webkit-align-items:center;
    		-webkit-box-align:center;
    		-webkit-box-pack:center;
    		color:#fff;
    		font-size:1.2rem;
    	}
    	i.aui-iconfont{
    		font-size: 1.2rem;
    	}
    	.buttons>div>div{
    		margin-left:0.5rem;
    	}
    	.buttons>div:first-child{
    		border-right:1px solid #fff;
    	}
    	.title{
	       display: -webkit-flex !important;
	       -webkit-align-items : center !important;
	    }
	    .red{
	    	color:#FF0000 !important;
	    }
	    .green{
	    	color:#269B82 !important;
	    }
	</style>
</head>
<body>
	<!--<section class="aui-content ">
        <div class="aui-grid aui-bg-info">
            <div class="aui-row" id="classify">
                <div class="aui-col-xs-7">
                	<div class="middle">
	                    <img src="../../image/user/wallet.png" width="50" height="35" />
	                    <div class="aui-grid-label">余额</div>
	                    <div id="wallet" class="aui-grid-label"></div>
                    </div>
                </div>
                <div class="aui-col-xs-2">
	                <div class="middle" tapmode onclick="deposit();">
	                    <img src="../../image/user/wallet_op.png" width="40" height="35" />
	                    <div class="aui-grid-label">充值</div>
	                </div>
                </div>
                <div class="aui-col-xs-2">
                	<div class="middle" tapmode onclick="withdrew();">
	                    <img src="../../image/user/wallet_op.png" width="40" height="35" />
	                    <div class="aui-grid-label">提现</div>
	                </div>
                </div>
            </div>
        </div>
    </section>-->
	<div class="panel">
		<div class="center">总资产(学豆)</div>
        <div id="wallet" class="center"></div>
        <div class="buttons">
        	<div tapmode onclick="deposit();">
        		<i class="aui-iconfont aui-icon-home"></i>
        		<div>充值</div>
        	</div>
        	<div tapmode onclick="withdrew();">
        		<i class="aui-iconfont aui-icon-home"></i>
        		<div>提现</div>
        	</div>
        </div>
	</div>
	<section class="aui-refresh-content">
		<div class="aui-content aui-margin-b-15">
	        <ul class="aui-list aui-media-list">
	            <li class="aui-list-item title">
            		交易记录
	            </li>
	            <div id="list">
	            </div>
	            <script id="list_template" type="text/x-dot-template">
                {{ for(var i=0; i< it.length; i++) { }}
                    <li class="aui-list-item">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner">
                                <div class="aui-list-item-text">
                                    <div class="aui-list-item-title">{{=it[i].course_name}}</div>
                                    {{? it[i].money>0}}
                                    <div class="aui-list-item-right red">{{="+"+it[i].money}}</div>
                                    {{??}}
                                    <div class="aui-list-item-right green">{{=it[i].money}}</div>
                                    {{?}}
                                </div>
                                <div class="aui-list-item-text aui-ellipsis-2">
                                    {{=it[i].trade_time}} {{? it[i].type==2}} 推课  {{?? it[i].type==3}} 制课  {{?}}
                                </div>
                            </div>
                        </div>
                    </li>
                {{ } }}
                </script>
	        </ul>
	    </div>
	</section>
</body>
<script src="../../script/doT.min.js"></script>
<script data-main="../../script/main" src="../../script/require.js"></script>
<script type="text/javascript">
	var count = 0;
	var token;
	var isbottom = false;//是否到底
    var isRefresh = true;//是否刷新
    var beans;
	apiready = function(){
		require(["api","zepto","common"],function(){
			$zb.prefs.getPrefs('token',function(ret){
		    	token = ret.value;
		    	getWallet();
		    	sendAjax();
		    })
		    
		    
		    api.setRefreshHeaderInfo({
                loadingImg: 'widget://image/refresh.png',
                bgColor: '#ccc',
                textColor: '#fff',
                textDown: '下拉刷新...',
                textUp: '松开刷新...'
            }, function(ret, err) {
                api.refreshHeaderLoadDone();
                if(ret){
                    isbottom = false;
                    isRefresh=true;
                    count = 0;
                    sendAjax();
                    getWallet();
                }
            });
		    
		    api.addEventListener({
                name:'scrolltobottom',
                extra:{
                    threshold:0            //设置距离底部多少距离时触发，默认值为0，数字类型
                }
            }, function(){
                isRefresh = false;
                isbottom?api.toast({
                    msg:'没有更多了'
                }):sendAjax();        
            });
		})
	};
	
	function sendAjax(){
		var data = {
			values:{
				token:token,
				appindex:count
			}
		}
		$zb.requestForData(data,'order','getPersonalTradeDetails',function(ret){
            if(ret.data.length==0){
                return;
            }
			if(isRefresh){
                $("#list").html(doT.template($("#list_template").text())(ret.data));
            }else{
                $("#list").append(doT.template($("#list_template").text())(ret.data));
            }
            if(ret.data.length===10){
                count+=10;
            }else{
                isbottom = true;
            }
		});
	}
	function getWallet(){
		var data = {
			values:{
				token:token,
			}
		}
		$zb.requestForData(data,'user','getWallet',function(ret){
			beans = parseFloat(ret.data.beans).toFixed(2);
			$("#wallet").text(beans);
		});
	}
	
	function deposit(){
        api.openFrame({
            name: 'recharge',
            url: './recharge.html',
            rect: {
                x:0,
                y:0,
                w:api.pageParam.headerPos.w,
                h:'auto',
                marginTop:api.pageParam.headerPos.h
            },
            pageParam:{
                headerPos:api.pageParam.headerPos
            }
        });
        api.execScript({
	        script: 'setFlag(true);'
        });
	}
	
	function withdrew(){
        api.prompt({
            title:'输入提现金额',
            type:'number',
            buttons: ['提现', '取消']
        }, function(ret, err) {
            var index = ret.buttonIndex;
            var text = ret.text;
            if(index==1){
                if(parseFloat(text)>beans){
                    api.toast({
	                    msg:'余额不足'
                    });
                    return;
                }
                var s_data={
                    values:{
                        token:token,
                        beans:parseFloat(text).toFixed(2)
                    }
                }
                $zb.requestForData(s_data,'order','withdrawMoney',function(ret1){
                    if(ret1.status=="OK"){
                        isbottom = false;
                        isRefresh=true;
                        sendAjax();
                        getWallet();
                        api.toast({
	                        msg:'提现成功'
                        });
                    }else{
                        api.toast({
	                        msg:ret1.status
                        });
                    }   
                })
            }
        });
	   
	}
	
	function refreshBean(){
        getWallet();
        api.execScript({
	        script: 'setFlag(false);'
        });
        api.closeFrame({
            name:'recharge'
        });
        api.toast({
            msg:'充值成功'
        });
	}
	
</script>
</html>